import { DrawerForm } from '@ant-design/pro-form';
import { Button } from 'antd';
import FormItem from 'antd/es/form/FormItem';
import 'dayjs/locale/zh-cn';

import React from 'react';
import UploadDragger from './UploadDragger';

interface AddAttachmentFileProps {
  onRefurbish: (attachment: PublicityRecordBo.Attachment[]) => void;
}

const AddAttachmentFile: React.FC<AddAttachmentFileProps> = ({ onRefurbish }) => {
  const config = {
    logo: 'assets/promotion_icon_douyin.png',
    type: 3,
    typeName: '文件',
  };

  return (
    <DrawerForm
      key="add_promotion_task_drawer_form_douyin"
      title={
        <div
          style={{
            display: 'flex',
          }}
        >
          <img
            width={22.4}
            style={{
              margin: 'auto 2px',
            }}
            src={config.logo}
          />
          新建 - {config.typeName}
        </div>
      }
      drawerProps={{
        maskClosable: false,
        destroyOnClose: true,
      }}
      trigger={<Button>{config.typeName}</Button>}
      onVisibleChange={(visible: boolean) => {}}
      initialValues={{
        isDemandClipboard: 1,
      }}
      onFinish={async (values) => {
        console.log('==========', values);

        if (values.attachments !== undefined) {
          const attachmentFilters = values.attachments.filter((item) => item.status == 'done');

          const attachments = attachmentFilters.map((item) => {
            return {
              id: item.response.data.id,
              type: 1,
              name: item.name,
              thumbUrl: item.thumbUrl,
            };
          });

          onRefurbish(attachments);
        }
        return true;
      }}
    >
      <FormItem name="attachments" label="附件">
        <UploadDragger onPreview={(file) => {}} />
      </FormItem>
    </DrawerForm>
  );
};
export default AddAttachmentFile;
